import React from "react";
import { useLocation, useNavigate } from "react-router-dom";
import { Card, NavBar } from "antd-mobile";
import { ProductCard } from "react-vant";
import { Cell } from 'react-vant';
import { SubmitBar } from 'react-vant';
import http from "../../api/http"
function Index() {
  const { state } = useLocation();
  console.log(state);
  const navigate = useNavigate();
//   /.购票页点击继续按钮跳转到订单详情页，实现支付功能（支付宝的沙箱支付）

  const handleToPlay=async()=>{
    const res=await http.get("/api/pay",{params:{
      title:"展览馆购票系统",
      id:state.id,
      price:state.price
    }})

    const {code,data}=res.data
    if(code===200)
      window.location.href=data
  }
  return (
    <div>
      <NavBar onBack={() => navigate(-1)}>订单详情</NavBar>

      <ProductCard
        price={state.price}
        desc={state.date}
        title={state.title}
        thumb={state.image}
      />

      <Card title="订单明细">
        <Cell title='票价' value={`￥${state.price}`} />
        <Cell title='票台手续费' value='￥1' />

        <Cell title='总计' value={`￥${state.price}`} />
      </Card>

      <SubmitBar price={(state.price)*100} buttonText="支付" onSubmit={()=>handleToPlay()}/>
    </div>
  );
}

export default Index;
